<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>编辑下载规则</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="stylesheet" href="/static/layuiadmin/layui/css/layui.css" media="all">
</head>
<body>


<div class="layui-form" lay-filter="layuiadmin-form-role" id="layuiadmin-form-role" style="padding: 20px 30px 0 0;">

  <div class="layui-form-item">
    <label class="layui-form-label">规则名称</label>
    <div class="layui-input-block">
      <input type="text" name="name" lay-verify="required" autocomplete="off" class="layui-input"
             placeholder="自定义" value="{$info.name}">
    </div>
  </div>


  <div class="layui-form-item">
    <label class="layui-form-label">授权App</label>
    <div class="layui-input-block">
      <input type="checkbox"  title="全选" lay-skin="primary" lay-filter="qx">
      {foreach $qas as $vo}
      <input type="checkbox" name="quick_apps[]" value="{$vo.id}" title="{$vo.name}" lay-skin="primary" {in name="$vo.id" value="$info.quick_apps"}checked{/in}>
      {/foreach}
    </div>
  </div>


  <div class="layui-form-item">
    <label class="layui-form-label">测试读者</label>
    <div class="layui-input-block">
      <input type="text" name="test_user_id" lay-verify="num" autocomplete="off" class="layui-input"
             placeholder="请输入读者id，可不填" value="{$info.test_user_id}">
      <div class="layui-form-mid layui-word-aux">该用户无需判断下列条件，可用于查看下载安装效果</div>
    </div>
  </div>

  <div class="layui-form-item">
    <label class="layui-form-label">用户群体</label>
    <div class="layui-input-block">
      <input type="radio" name="user_grep" value="1" title="广告用户" {if $info['user_grep'] == 1}checked{/if}>
      <input type="radio" name="user_grep" value="2" title="屏蔽地区" {if $info['user_grep'] == 2}checked{/if}>
      <input type="radio" name="user_grep" value="0" title="不限" {if $info['user_grep'] == 0}checked{/if}>
    </div>
  </div>


  <div class="layui-form-item">
    <label class="layui-form-label">充值条件</label>
    <div class="layui-input-block">
      <input type="radio" lay-filter="is_pay" name="is_pay" value="0" title="不限"  {if $info['is_pay'] == 0}checked{/if}>
      <input type="radio" lay-filter="is_pay" name="is_pay" value="1" title="已充值" {if $info['is_pay'] == 1}checked{/if}>
      <input type="radio" lay-filter="is_pay" name="is_pay" value="2" title="未充值" {if $info['is_pay'] == 2}checked{/if}>
    </div>
  </div>

  <div class="layui-form-item" id="payItem" {if $info.is_pay != 1}style="display: none;"{/if}>
    <div class="layui-inline">
      <label class="layui-form-label">充值金额</label>
      <div class="layui-form-mid layui-word-aux">>=</div>
      <div class="layui-input-inline" style="width: 100px;">
        <input type="text" name="mini_pay_money" placeholder="￥" autocomplete="off" class="layui-input" lay-verify="money" value="{$info.mini_pay_money/100}">
      </div>
      <div class="layui-form-mid">元</div>
    </div>
  </div>


  <div class="layui-form-item">
    <label class="layui-form-label">注册范围</label>
    <div class="layui-input-block">
      <input type="radio" name="register_type" lay-filter="register" value="0" title="不限" {if $info['register_type'] == 0}checked{/if}>
      <input type="radio" name="register_type" lay-filter="register" value="1" title="自定义" {if $info['register_type'] == 1}checked{/if}>
    </div>
  </div>


  <div class="layui-form-item" id="registerItem" {if $info['register_type'] != 1}style="display:none;"{/if}>
    <div class="layui-input-block">
      <div class="layui-input-inline" style="width: 100px;">
        <input type="number" name="register_start" placeholder="可不填" autocomplete="off" class="layui-input" lay-verify="num" value="{$info.register_start}">
      </div>
      <div class="layui-form-mid">天外，且</div>
      <div class="layui-input-inline" style="width: 100px;">
        <input type="number" name="register_end" placeholder="可不填" autocomplete="off" class="layui-input" lay-verify="num" value="{$info.register_end}">
      </div>
      <div class="layui-form-mid">天内</div>
      <div class="layui-form-mid layui-word-aux">1天代表24小时不是自然日，如：一周内，只需填写第二项“7天内”，范围为闭区间</div>
    </div>
  </div>


  <div class="layui-form-item">
    <label class="layui-form-label">源文件链接</label>
    <div class="layui-input-block">
      <input type="text" name="file_url" lay-verify="required" autocomplete="off" class="layui-input"
             placeholder="请输入" value="{$info.file_url}">
    </div>
  </div>

  <div class="layui-form-item" id="picItem">
    <label class="layui-form-label">弹窗图片</label>
    <div class="layui-input-block">
      <div class="layui-upload-drag" id="pic">
        <div id="pic_head" {if $info['pic']}style="display:none;"{/if}>
          <i class="layui-icon"></i>
          <p>点击上传，或将文件拖拽到此处</p>
        </div>
        <div class="{if !$info['pic']}layui-hide{/if}" id="uploadDemoView">
          <img src="__IMG_DOMAIN__{$info.pic}" alt="上传成功后渲染" style="max-width: 128px;width: 128px;">
          <input type="hidden" name="pic" value="{$info['pic']}">
        </div>
      </div>
    </div>
  </div>

  <div class="layui-form-item layui-hide">
    <button class="layui-btn" lay-submit lay-filter="LAY-user-role-submit" id="LAY-user-role-submit">提交</button>
  </div>
</div>


<script src="/static/layuiadmin/layui/layui.js"></script>
<script>
  layui.config({
    base: '/static/layuiadmin/' //静态资源所在路径
  }).extend({
    index: 'lib/index' //主入口模块
  }).use(['index', 'form', 'laydate','table'], function(){
    var $ = layui.$
            ,admin = layui.admin
            ,element = layui.element
            ,layer = layui.layer
            ,form = layui.form
            ,table = layui.table
            ,upload = layui.upload;

    form.on('checkbox(qx)', function (data) {
      if (data.elem.checked === true) {
        $("input[name='quick_apps[]']").prop('checked', true);
      } else {
        $("input[name='quick_apps[]']").prop('checked', false);
      }
      form.render('checkbox');
    });

    table.init('parse-table-demo', { //转化静态表格
      //height: 'full-500'
      toolbar: '#addNovel' //开启头部工具栏，并为其绑定左侧模板
      , defaultToolbar: false
      , size: 'sm' //小尺寸的表格
    });

    form.on('radio(is_pay)', function(data){
      if (data.value == 1){
        $("#payItem").css('display','block');
      }else{
        $("#payItem").css('display','none');
      }
    });

    form.on('radio(register)', function(data){
      if (data.value == 1){
        $("#registerItem").css('display','block');
      }else{
        $("#registerItem").css('display','none');
      }
    });


    //拖拽上传
    upload.render({
      elem: '#pic'
      ,accept:'images'
      ,acceptMime: 'image/jpeg, image/png'
      ,url: '/tool/uploadPic?dirName=popup' //此处用的是第三方的 http 请求演示，实际使用时改成您自己的上传接口即可。
      ,done: function(res){
        if (res.code !== 0){
          layui.$('#uploadDemoView').removeClass('layui-hide').find('img').attr('src', res.data.picUrl);
          layui.$('#uploadDemoView').find('input').val(res.data.filePath);
          layui.$('#pic_head').addClass('layui-hide');
          console.log(res)
        }else {
          layer.msg(res.msg);
        }
      }
    });


    /* 自定义验证规则 */
    form.verify({
      num: function (value) {
        if (value.length > 0) {
          var reg = /^[1-9]\d*$/; // 正整数的正则表达式
          if (!reg.test(value)) {
            return '请输入正确的值';
          }
        }
      },
      money: function (value) {
        if (value.length > 0) {
          var res = false;
          var regex = /^[0-9]+(\.[0-9]+)?$/;
          if (regex.test(value)) {
            var num = parseFloat(value);
            if (num > 0) {
              res = true;
            }
          }
          if (res === false) {
            return '请输入正确金额';
          }
        }
      },
    });

  });




</script>
</body>
</html>
